import React, {useState, useEffect} from 'react'

export default function useMousePosition() {
  const [position, setposition] = useState({x: 0, y: 0})
  useEffect(() => {
    const updateMouse = (event) => {
      setposition({x: event.clientX, y: event.clientY})
    }
    document.addEventListener('mousemove', updateMouse)
    // 组件卸载时执行
    return () => {
      document.removeEventListener('mousemove', updateMouse)
    }
  }, [])
  return position
  // return (
  //   <div>
  //     <h1>X: {position.x}, Y: {position.y}</h1>
  //   </div>
  // )
}
